
<template>
  <div>
    <!-- 客户编辑dialog-->
    <el-dialog
      :title="title"
      width="800px"
      :close-on-click-modal="false"
      v-dialogDrag
      :visible.sync="editVisible"
    >
      <el-form
        label-width="105px"
        ref="editForm"
        :model="editForm"
      >
        <el-row>
          <el-col :span="10">
            <el-form-item label="业务编号:" prop="contractCode">
              <el-input v-model="editForm.contractCode" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="客户:" prop="companyName" >
              <el-input v-model="editForm.companyName" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="10">
            <el-form-item label="产品:" prop="productName">
              <el-input v-model="editForm.productName" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="当前价格:" prop="price">
              <el-input v-model="editForm.price" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="10">
            <el-form-item label="调整价格:" prop="newPrice" :rules="[
                  {required: true, message:'请输入调整价格', trigger:'blur'},
                  {validator:onlyNumber, trigger:'blur'}
                 ]">
              <el-input v-model="editForm.newPrice"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="执行时间:" prop="effectTime"
                          :rules="[
                  {required: true, message:'请输入执行时间', trigger:'blur'}
                 ]">
              <el-date-picker
                v-model="editForm.effectTime"
                type="datetime"
                value-format="yyyy-MM-dd HH:mm:ss"
                placeholder="选择日期时间"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button size="small" type="primary" @click="doSubmit()" v-noMoreClick
          >确定</el-button
        >
        <el-button size="small" @click="close()">取消</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import { getList } from '@/api/market/crm.js'
import { edit } from '@/api/market/companyProductCredit.js'
export default {
  components: {
  },
  data () {
    return {
      areaLabel: {},
      method: '',
      title: '',
      editForm: {
        businessProductId: '',
        companyName: '',
        price: '',
        productName: '',
        contractCode: '',
        effectTime: '',
        newPrice: ''
      },
      editVisible: false,
      detailsVisible: false,
      dataRule: {
        contactName: [{ required: true, message: '请输入客户名称', trigger: 'blur' }],
        // productName: [
        //   { required: true, message: '请选择产品类型', trigger: 'change' }
        // ],
        creditQuatity: [
          { required: false, message: '请输入信用量', trigger: 'blur' }
        ]
      },
      tableData1: [],
      page: {
        pageSize: 10,
        pageNo: 1,
        total: 0
      },
      props: 1,
      dialogVisible: false,
      query: ''
    }
  },
  methods: {
  	handleClose(done) {
				this.$Msg.confirm({
					title:'您确定要关闭吗？',
					content:this.GLOBAL.FORM_CLOSE_TIPS,
					confirmCall:()=>{
						done();
					}
				})
			},
    select (e) {
      this.editForm.companyName = e.names
      this.editForm.companyId = e.id
      this.dialogVisible = false
      console.log(e)
    },
    onlyNumber (rule, value, callback) {
      if (value && !(/^[1-9]\d*$/).test(value)) {
        callback(new Error('只能填写正整数'))
      } else {
        callback()
      }
    },
    // 获取列表带分页
    getList (params, props, orderName, orderByAORC, queryNames, queryState) {
      this.loading = true
      getList({
        pageSize: params.pageSize,
        pageNo: params.pageNo,
        props: props,
        orderBy: orderName,
        orderByAORC: orderByAORC,
        names: queryNames,
        state: queryState
      }).then((res) => {
        if (res.data.code === '200') {
          console.log(res.data.result.list)
          this.tableData1 = res.data.result.list
          this.page.total = res.data.result.count
        }
        this.loading = false
      })
    },
    init (editForm) {
      this.editVisible = true
      this.$nextTick(() => {
        this.$refs.editForm.resetFields()
        this.editForm = editForm
      })
      this.title = '销售调价'
    },
    getArea1 (e) {
      if (e.province !== '' && e.city !== '' && e.district !== '') {
        this.editForm.countyCode = JSON.stringify(e)
      } else {
        this.editForm.countyCode = ''
      }
    },
    close () {
      this.editVisible = false
    },
    doSubmit () {
      this.$refs['editForm'].validate((valid) => {
        if (valid) {
          edit(this.editForm).then((res) => {
            if (res.data.code === '200') {
              this.$message({
                message: '编辑成功',
                type: 'success'
              })
              this.editVisible = false
              this.$emit('refreshDataList')
            }
          })
        }
      })
    }
  },
  mounted () {
    this.getList(this.page, 1)
  }
}
</script>
<style lang="scss" scoped>
.view-container {
  margin-bottom: 20px;
  display: flex;
  .label-container {
    width: 150px;
    text-align: right;
    font-size: 16px;
    font-weight: 400;
    color: #666666;
  }
  .form-container {
    font-size: 14px;
    font-weight: 400;
    color: #333333;
    width: 200px;
  }
}
</style>
